<template>
  <el-card class="container">
    <el-row :gutter="32" v-if="chartTrendData.allAmount">
      <el-col :span="6">
        <!-- 数据模块 -->
        <TrendData :data="chartTrendData"></TrendData>
      </el-col>
      <el-col :span="18">
        <!-- 图表模块 -->
        <TrendChart :data="chartTrendData"></TrendChart>
      </el-col>
    </el-row>
  </el-card>
</template>

<script setup>
import TrendData from './trend-data.vue'
import TrendChart from './trend-chart.vue'
import { ref } from 'vue'
import { getChartTrend } from '@/api/chart'

const chartTrendData = ref([])
const getChartTrendData = async () => {
  const res = await getChartTrend()
  chartTrendData.value = res
}
getChartTrendData()
</script>

<style scoped lang="scss">
.container {
  height: 286px;
}
</style>
